<!-- 
  * Copyright (c) 2022 iSoftStone Information Technology (Group) Co.,Ltd.
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
  * You may obtain a copy of the License at
  *
  *     http://www.apache.org/licenses/LICENSE-2.0
  *
  * Unless required by applicable law or agreed to in writing, software
  * distributed under the License is distributed on an "AS IS" BASIS,
  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  * See the License for the specific language governing permissions and
  * limitations under the License.
 -->
<template>
	<view class="tabs">
		<u-tabs :list="list" lineWidth="30" :itemStyle="style.itemStyle" :activeStyle="style.activeStyle"
			:inactiveStyle="style.inactiveStyle" :duration="0" :current="current" @click="tabClick()"
			scrollable="false">
		</u-tabs>
	</view>
</template>

<script>
	export default {
		props: {
			current: Number,
			activityId: Number
		},
		data() {
			return {
				index: 0,
				style: {
					activeStyle: "color: rgba(0,0,0,0.90);font-size: 14px;font-weight: blod;",
					inactiveStyle: "font-size: 14px;color: rgba(0,0,0,0.5)}",
					itemStyle: "height: 48px;padding:0px;width:20%"
				},
				// tabs切换
				list: [{
						name: '首页',
						path: "pages/componet/activity/detail/index"
					},
					{
						name: '活动报名',
						path: "pages/componet/activity/activeSingin/index"
					},
					
					{
						name: '进度',
						path: "pages/componet/activity/activeProg/index"
					},
					{
						name: '赛事说明',
						path: "pages/componet/activity/activeMatch/index"
					},
					{
						name: 'FAQ',
						path: "pages/componet/activity/activeFaq/index"
					}
				],
				userInfo: {},
				WxData: {
					nickName: "请登录",
					avatarUrl: "",
					state: "请登录"
				},
			};
		},

		methods: {
			tabClick(data) {
				this.userInfo = this.$store.state.$userInfo
				if (data.index === 1) {
					if (!this.userInfo.openId) {
						this.loginWx()
						return false
					} else if (!this.userInfo.phone) {
						this.showModalPhone()
						return false
					}
				}
				if (this.userInfo.profession !== '学生' && data.index === 1) {
					uni.$u.toast("此活动只支持学生报名")
					return false
				}
				
				if (data.index === 0) {
					wx.switchTab({
						url: '/pages/main/activity/activity'
					});
				} else {
					uni.$u.route({
						type: "redirect",
						url: data.path,
						params: {
							id: this.activityId,
							current: data.index
						},
					})
				}

			},
			loginWx() {
				uni.getUserProfile({
					lang: 'zh_CN',
					desc: '用户登录', // 声明获取用户个人信息后的用途，后续会展示在弹窗中，请谨慎填写
					success: (res) => {
						this.getOpenid(res)
					},
					// 失败回调
					fail: (err) => {
						// 弹出错误
						uni.showModal({
							content: '已拒绝小程序获取信息',
							showCancel: false
						})
					}
				});
			},
			getOpenid(res) {
				uni.login({
					success: (item) => {
						const data = {
							"code": item.code
						}
						getopenId(data).then(el => {
							if (el.openId) {
								res.userInfo.openId = el.openId
								this.WxData.avatarUrl = res.userInfo.avatarUrl
								this.WxData.nickName = res.userInfo.nickName
								this.WxData.openId = el.openId
								this.$store.commit("setUserInfo", res.userInfo)
								console.log(res.userInfo, "setUserInfo")
								uni.setStorage({
									key: 'userInfo',
									data: res.userInfo,
									success: function() {
										console.log("保存登录信息")
									}
								});
								this.getUserByOpenId(el.openId)
							}
						})
					},
				});
			},
			getUserByOpenId(openId) {
				//根据openId 获取用户信息，有信息登录，没有信息新增用户信息
				const data = {
					openId: openId
				}
				getUserByOpenId(data).then(res => {
					if (res.userName) {
						res.username = res.userName
						this.WxData.id = res.id
						this.$store.commit("setUserInfo", res)
						this.userLogin(res)
					} else {
						this.userAdd()
					}
				})
			},
			userAdd() {
				let data = {
					openId: this.$store.state.$userInfo.openId,
					nickName: encodeURI(this.$store.state.$userInfo.nickName),
					avatarUrl: this.$store.state.$userInfo.avatarUrl,
					inviteOpenId: this.$store.state.inviteOpenId
				}
				usersave(data).then(res => {
					if (res) {
						this.getUserByOpenId(data.openId)
						//res.openId = data.openId
						//this.userLogin(res)
					}
				})
			},
			userLogin(data) {
				userLogin(data).then(res => {
					if (res.token) {
						this.$store.commit("setUserToken", res.token)
						this.userEdit()
					}
				})
			},
			userEdit() {
				let data = {
					openId: this.WxData.openId,
					nickName: encodeURI(this.WxData.nickName),
					avatarUrl: this.WxData.avatarUrl,
					id: this.WxData.id
				}
				userEdit(data).then(res => {
					if (res) {
						//this.$store.commit("setUserInfo", res)
						this.info()
					}
				})

			},
			showModalPhone() {
				const that = this
				uni.showModal({
					content: "请完善您的个人信息",
					cancelText: "再想想",
					confirmText: "去编辑",
					success: function(res) {
						if (res.confirm) {
							that.$u.route({
								url: 'pages/componet/main/edit/edit'
							})
						}
					}
				})
			},
		}
	};
</script>

<style>
	/* #ifndef H5 */
	page {
		height: 100%;
		background-color: #f2f2f2;
	}

	/* #endif */
</style>

<style lang="scss" scoped>
	.tabs {
		background: #ffffff;
	}
</style>
